<template>
    <div>
       <Card>
            <p slot="title">
                电子签审核
            </p>
            <div>
                <Form class="step-form" ref="detail" :model="detail"   :label-width="100">
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="签约人姓名：" prop="signerName" label-position="left" :label-width="150">
                                <Input  :disabled="hasSubmit" v-model="detail.signerName" type="text" placeholder="请输入签约人姓名" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="签约人手机：" prop="signerPhone" label-position="left" :label-width="150">
                                <Input :disabled="hasSubmit" v-model="detail.signerPhone" type="text" placeholder="请输入签约人手机" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="签约人身份证号：" prop="signerCardNumber" label-position="left" :label-width="150">
                                <Input :disabled="hasSubmit" v-model="detail.signerCardNumber" type="text" placeholder="请输入签约人身份证号" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="电子邮箱：" prop="email" label-position="left" :label-width="150">
                                <Input :disabled="hasSubmit" v-model="detail.email" type="text" placeholder="请输入电子邮箱" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="企业名称：" prop="partyName" label-position="left" :label-width="150">
                                <Input :disabled="hasSubmit" v-model="detail.partyName" type="text" placeholder="请输入企业名称" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="营业执照号：" prop="businessLicense" label-position="left" :label-width="150">
                                <Input :disabled="hasSubmit" v-model="detail.businessLicense" type="text" placeholder="请输入营业执照号" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="账户名称：" prop="accountName" label-position="left" :label-width="150">
                                <Input :disabled="hasSubmit" v-model="detail.accountName" type="text" placeholder="请输入账号名称" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="账户号码：" prop="bankNumber" label-position="left" :label-width="150">
                                <Input :disabled="hasSubmit" v-model="detail.bankNumber" type="text" placeholder="请输入账号号码" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="开户银行：" prop="bankName" label-position="left" :label-width="150">
                                <Input :disabled="hasSubmit" v-model="detail.bankName" type="text" placeholder="请输入开户银行" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row>
                        <i-col span="10">
                            <FormItem label="委托代理人授权书：" prop="authorizationUrl" label-position="left" :label-width="150">
                                <img v-if="detail.agentAuthorizationUrl !== ''" :src="detail.agentAuthorizationUrl" height="200" width="200">
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="审核状态：" prop="ebqAuthStatus" label-position="left" :label-width="150">
                                <span class="ebauthState">{{ebqAuth_state[detail.ebqAuthStatus]}}</span>
                            </FormItem>
                        </i-col>
                    </Row>
                    <Row span="12">
                        <i-col span="12" >
                            <FormItem label="失败原因：" prop="ebqRefuseReason" label-position="left" :label-width="150">
                                <textarea   rows="6" v-model="detail.ebqRefuseReason" />
                            </FormItem>
                        </i-col>
                    </Row>
                    <FormItem >
                        <Button @click="back" class="footer_btn">返回</Button>
                        <template>
                            <Button v-if="detail.ebqAuthStatus == '3'" type="primary" class="footer_btn" @click="submit">提交验证</Button>
                            <Button v-else :disabled="hasSubmit"  class="footer_btn">提交验证</Button>
                        </template>
                        <template>
                            <Button v-if="detail.ebqAuthStatus == '3'"  type="error" class="footer_btn" @click="audit_failure">审核失败</Button>
                            <Button v-else :disabled="hasSubmit"  class="footer_btn">审核失败</Button>
                        </template>
                    </FormItem>
                </Form>
                <!--审核失败二次确认弹窗-->
                <Modal v-model="auditModel" width="360">
                    <p slot="header" style="color:#f60;">
                        <Icon type="information-circled"></Icon>
                        <span>审核失败提示</span>
                    </p>
                    <div style="text-align:center">
                        <p style="font-size:18px;">确定更改为审核失败吗？</p>
                    </div>
                    <div slot="footer">
                        <Button type="error" @click="confirm()" size="large">确定</Button>
                        <Button type="info" @click="noconfirm()" size="large">取消</Button>
                    </div>
                </Modal>
            </div>
        </Card>
    </div>
</template>

<script>
    import ajax from '../../../libs/axios.js'
    export default {
        name: 'electronicdetail',
        data () {
            return {
                hasSubmit:true,                    // 不可修改
                auditModel:false,                  // 审核失败二次确认弹窗
                detail:{
                    signerName:"",                 // 签约人姓名
                    signerPhone:"",                // 签约人手机号
                    signerCardNumber:"",           // 签约人身份证号
                    email:"",                      // 电子邮箱
                    partyName:"",                  // 企业名称
                    businessLicense:"",            // 营业执照
                    bankName:"",                   // 开户银行
                    bankNumber:"",                 // 账号号码
                    accountName:"",                // 账号名称
                    agentAuthorizationUrl:"",      // 委托代理人授权书
                    ebqAuthStatus:"",              // 审核状态
                    ebqRefuseReason:"",            // 失败原因
                },
                ebqAuth_state:{"3":"待审核","1":"审核成功","2":"审核失败","4":"签章验证中"},
            }
        },
        methods: {
            // 数据初始化
            init () {
                this.getlist();
            },
            //返回至首页
            back(){
                this.$router.push({
                    name: 'electronicindex'
                })
            },
            // 获取信息
            getlist(){
                let url = 'adminlogin/ebq/selectInfoById.html'
                let data = {
                    id:this.$route.params.id
                }
                ajax.formRes(url, data).then(res => {
                    this.detail=res.data;
                }).catch(err => {
                    console.log('有错误信息')
                })
            },
            // 审核失败方法
            audit_failure(){
                if (!this.detail.ebqRefuseReason) {
                    this.$Message.error("请输入失败原因")
                }else{
                    this.auditModel=true;
                }
            },
            // 审核失败弹窗二次确认按钮
            confirm(){
                let url = 'adminlogin/ebq/auditData.html'
                let data = {
                    authPartyId:this.$route.params.id,
                    adminUserId:localStorage.getItem("userId"),
                    authStatus:"2",
                    refuseReason:this.detail.ebqRefuseReason
                }
                ajax.formRes(url, data).then(res => {
                    if (res.code == 200){
                        this.$Message.success("审核失败成功");
                        this.auditModel=false;
                        this.$router.push({
                            name:"electronicindex"
                        })
                    }
                }).catch(err => {
                    console.log('有错误信息')
                })
            },
            // 审核失败弹窗取消按钮
            noconfirm(){
                this.auditModel=false;
            },
            // 提交验证的方法
            submit(){
                let url = 'adminlogin/eleSign/applyEleSign.html'
                let data = {
                    ebqAuthPartyId:this.$route.params.id,
                    userId:localStorage.getItem("userId"),
                }
                ajax.formRes(url, data).then(res => {
                   if (res.code == 200){
                       this.$Message.success("提交验证成功");
                       this.$router.push({
                           name:"electronicindex"
                       })
                   }else if (res.code == 311) {
                       this.$Message.error(res.msg);
                   }else if (res.code == 312) {
                       this.$Message.error(res.msg);
                   }else{
                       this.$Message.error("提交审核失败");
                   }
                }).catch(err =>{
                    console.log(err)
                })
            }
        },
        created() {
            this.init();
        },
        activated() {
            this.init();
        }
    }
</script>
<style>
    textarea{
        display: inline-block;
        width: 397.5px;
        line-height: 1.5;
        padding: 4px 7px;
        font-size: 12px;
        border: 1px solid #dddee1;
        border-radius: 4px;
        color: #495060;
        background-color: #fff;
        background-image: none;
        position: relative;
        cursor: text;
    }
    .footer_btn{
        width:150px;
        margin-right: 15px;
    }
    .ebauthState{
        font-size: 16px;
        color: #ff0000;
        font-weight: bolder;
    }
</style>

